<!DOCTYPE html>
<html>
　　<head>
  <meta charset="utf-8">
　　　　<title>CSS arrow</title>
　　　　<style>
  .arrow{
  position: relative;
  width: 200px;
  height: 50px;
  border-top: 8px solid #5bc0de;
  border-right: 8px solid #5bc0de;
  box-sizing: border-box;
}
.arrow::after{
  content: "";
  position: absolute;
  bottom: -14px;
  right: -17px;
  border-top: 14px solid #5bc0de;
  border-left: 14px solid transparent;
  border-right: 14px solid transparent;
}
</style>
 　　<meta http-equiv="Content-Type" content="text/html" charset="UTF-8">
　　</head>
　　<body>
 　　<div class="arrow"></div>
　　</body>
</html>